var WebSocketClient = require('websocket').client;
const { ipcRenderer } = require("electron")
var client = new WebSocketClient();
window.addEventListener('DOMContentLoaded', () => {
    let port = localStorage.getItem('port')
    let ziyuan = document.querySelector('.icons .icon-ziyuan')
    console.log(ziyuan)
    ziyuan.onclick = () => {
        ipcRenderer.send("closeTalk", "close")
    }

    function stringToArray(value) {
        let tempArr = value.split('')
        tempArr.unshift('[')
        tempArr.push(']')
        let str = tempArr.join('')
        str = str.replace(/'/g, '"')
        str = str.replace(/name/g, '"name"')
        str = str.replace(/msg/g, '"msg"')

        return JSON.parse(str)
    }

    client.on('connect', function(connection) {
        let send = document.querySelector('.sendMessage')
        let box = document.querySelector('textarea')
        send.addEventListener('click', () => {
            if (connection.connected) {
                connection.sendUTF(box.value.trim());
                setTimeout(() => {
                    box.value = ''
                }, 0)
            }
        })
        document.onkeydown = (e) => {
            if (box.value.trim() && (e.code == 'Enter' || e.code == 'NumpadEnter')) {
                if (connection.connected) {
                    connection.sendUTF(box.value.trim());
                    setTimeout(() => {
                        box.value = ''
                    }, 0)
                }
            }
        }

        console.log('WebSocket Client Connected');
        connection.on('error', function(error) {
            console.log("Connection Error: " + error.toString());
        });
        connection.on('close', function() {
            console.log('echo-protocol Connection Closed');
        });
        connection.on('message', function(message) {
            let array = stringToArray(message.utf8Data)
            let call = document.querySelector('.call')
            let content = ''
            console.log(message)
            console.log(typeof array)
            for (let it of array) {
                if (port == 8082) {
                    content += `
                        <div class="${it.name == 'me' ?'me':'other'}">
                            <div class="${it.name == 'me' ?'rightImg':'leftImg'}">
                                <img src="./images/tx.jpg" alt="">
                            </div>
                            <div class="${it.name == 'me' ?'rightWord':'leftWord'}">
                                ${it.msg}
                            </div>
                        </div>
                    `
                } else {
                    content += `
                        <div class="${it.name == 'me' ?'other':'me'}">
                            <div class="${it.name == 'other' ?'rightImg':'leftImg'}">
                                <img src="./images/tx.jpg" alt="">
                            </div>
                            <div class="${it.name == 'other' ?'rightWord':'leftWord'}">
                                ${it.msg}
                            </div>
                        </div>
                    `
                }

            }
            call.innerHTML = content
            let lt = document.querySelector('.lt')
            lt.scrollTop = lt.scrollHeight;
            console.log(4564)
        });


    });


    client.on('connectFailed', function(error) {
        console.log('Connect Error: ' + error.toString());
    });



    client.connect(`ws://1.117.222.187:${port}/`, 'echo-protocol');

})

// let str = "{ name: 'me', msg: '是的' },{ name: 'me', msg: '士大夫' },{ name: 'me', msg: '士大夫和感受到' },{ name: 'me', msg: '是的伽师瓜' },{ name: 'me', msg: '士大夫' },{ name: 'me', msg: '地方个地方嘎达' },{ name: 'me', msg: '个反对广泛的还是股份的' }"